<!DOCTYPE html>
<html class="no-js">
<head lang="en">
    <title>demo</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="./stylesheets/base.css">
    <style>
        .input-info {
            text-align: justify;
            text-justify: distribute-all-lines; /*ie6-8*/
            text-align-last: justify; /* ie9*/
            -moz-text-align-last: justify; /*ff*/
            -webkit-text-align-last: justify; /*chrome 20+*/
        }

        @media screen and (-webkit-min-device-pixel-ratio: 0) {
            /* chrome*/
            .input-info:after {
                content: ".";
                display: inline-block;
                width: 100%;
                overflow: hidden;
                height: 0;
            }
        }
    </style>
</head>
<body>
<!---->
<div class="input-info">用户名</div><input type="text" placeholder="请输入用户名" class="input1"/>
<br/>
<div class="input-info">密码</div><input type="text" placeholder="请输入密码" class="input2"/>
<!--<script src="js/Modernizr.js"></script>-->
<script src="//cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="plugins/jquery.placeholder.1.0.0.min.js"></script>
<script>
    $(".input1,.input2").PlaceHolder();
</script>
</body>
</html>